How to display code in blogger posts

在本文中，您可以選擇自己喜歡的 highlight.js 風格，並藉由在自己網站引用相關檔案的 CDN 路徑來為自己網站的程式碼上色。

語法高亮 (Syntax Highlighting) 可以根據不同程式語言的關鍵字、變數、註解等，賦予不同的顏色和樣式，大幅提升程式碼的可讀性與美觀度，帶給讀者更好的閱讀體驗。

hilite.me converts your code snippets into pretty-printed HTML format, easily embeddable into blog posts, emails and websites. Just copy the source code to the left pane, select the language and the color scheme, and click "Highlight!".

db.SyntaxHighlighter 是一支不錯的程式碼高亮度顯示程式，特點為: 缺點就是載入速度較慢。 dp.SyntaxHighlighter 原本已經有一個 CSS 檔了，但如果將這個 CSS 檔以 “Link” 的方式載入，卻無法正常顯示。 所以，請自行增加下列 CSS 到 blogger 樣板的 CSS 區段: font-family: "Consolas", "Courier New", Courier, mono; font

In this tutorial, I’ll guide you through the process of adding a syntax highlighter to Blogger website, allowing you to create beautiful and stylish code boxes in blogger.

寫跟 code 相關的 Blog 通常會用到 highlight 標示程式碼片段+更好看，2016年已有不少套件可選。 這裡使用步驟最少最簡單的 highlight.js（官網）。